﻿<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
    <title id='Description'>Calendar</title>
    <link rel='stylesheet' type='text/css' href='./Content/fullcalendar.css' />
    <script type="text/javascript" src="./scripts/jquery-1.8.2.min.js"></script>
    <script type='text/javascript' src='./scripts/jquery-ui-1.8.23.custom.min.js'></script>
    <script type='text/javascript' src='./scripts/fullcalendar.min.js'></script>
    <script type='text/javascript'>

        $(document).ready(function () {
            $('#calendar').fullCalendar({
                header: {
                    left: 'prev,next today',
                    center: 'title',
                    right: 'month,basicWeek,basicDay'
                },
                editable: false,
                selectable: false,
                height: 500,
                aspectRatio: 1.2,
                events: '/events'
            });

        });

    </script>
    <style type='text/css'>
        body
        {
            margin-top: 40px;
            text-align: center;
            font-size: 12px;
            font-family: "Lucida Grande" ,Helvetica,Arial,Verdana,sans-serif;
        }
        
        .gen
        {
            direction: ltr;
            text-align: left;
        }
    </style>
</head>
<div id="container" style="width: 1000px">
    <div id="header" style="background-color: #FFA500;">
        <h1 style="margin-bottom: 0; color: #000080; text-align: center">
            History
        </h1>
    </div>
    <div id='calendar'></div>
    <div id="footer" style="background-color: #FFA500; clear: both; text-align: center;">
        <div id="stateText" style="color: #000080;">
            ----------------</div>
    </div>
</div>
</html>
